page {
  height        : 100vh;
  padding-bottom: 92rpx;
  position      : relative;
}

.cart {
  margin-bottom: 20rpx;

  .choose-address {
    display        : flex;
    justify-content: center;

    .user-info-row {
      width         : 100%;
      display       : flex;
      margin-top    : 20rpx;
      padding       : 0 15rpx;
      font-size     : 28rpx;
      flex-direction: column;


      .user-info {
        display        : flex;
        justify-content: space-between;
        margin-bottom  : 10rpx;

        .user-name {}

        .user-phone {}
      }

      .user-address {}


    }

    button {
      margin-top: 40rpx;
      width     : 80%;
    }
  }
}

.cart-content {
  .cart-title {
    height     : 90rpx;
    font-size  : 38rpx;
    line-height: 90rpx;
    border-top : 2rpx solid var(--theme);
    padding    : 0 15rpx;
  }

  .cart-main {
    border-top: 2rpx solid var(--theme);
    overflow  : hidden;

    .cart-item {
      display      : flex;
      margin-top   : 10rpx;
      height       : 220rpx;
      border-bottom: 1rpx solid #999;

      .img-wrap,
      .goods-info-wrap {
        display        : flex;
        justify-content: center;
        align-items    : center;
      }

      .img-wrap {
        flex: 3;

        image {
          width: 86%;
        }
      }

      .goods-info-wrap {
        flex           : 6;
        flex-direction : column;
        justify-content: space-around;
        padding        : 0 20rpx;

        .goods-title {
          display           : -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 2;
          overflow          : hidden;
          font-size         : 30rpx;
          color             : #000;
        }

        .goods-info-bottom {
          width          : 100%;
          display        : flex;
          justify-content: space-between;

          .goods-price {
            color      : var(--theme);
            font-size  : 36rpx;
            font-weight: bold;
          }

          .goods-tools {
            display        : flex;
            width          : 42%;
            justify-content: flex-end;

            .num {
              margin   : 0 10rpx;
              color    : #999;
              font-size: 28rpx;
            }
          }
        }
      }
    }
  }
}

.total-pay {
  width     : 100vw;
  height    : 90rpx;
  display   : flex;
  border-top: 2rpx solid #fafafa;
  position  : absolute;
  bottom    : 0;
  left      : 0;

  .total-price {
    flex           : 3;
    width          : 100%;
    display        : flex;
    justify-content: flex-end;
    padding-right  : 32rpx;

    .txt {
      padding-top: 1rpx;
    }

    .price-num {
      display       : flex;
      flex-direction: column;
      font-size     : 38rpx;
      color         : var(--theme);

      text {
        font-size : 24rpx;
        color     : #000;
        text-align: right;
      }
    }
  }

  .pay-button {
    flex            : 2;
    display         : flex;
    justify-content : center;
    align-items     : center;
    background-color: var(--theme);
    font-size       : 36rpx;
    color           : #fff;
  }
}